import { useRoutes } from "react-router-dom";
import { routes } from "./routes/route.tsx";
import { useEffect } from "react";
import Common from "./store/Common.ts";
import { observer } from "mobx-react";
import { Loading } from "./components/common.tsx";

const App = observer(() => {
	Common.isLoading;
	useEffect(() => {
		Common.setLoading(true);
		setTimeout(() => {
			Common.setLoading(false);
		}, 1000);
	}, []);
	return (
		<>
			{Common.isLoading && (
				<div className="wh-full position-fixed z-1 bg-[rgba(0,0,0,0.5)]  bg-cover flex flex-justify-center flex-items-center">
					<Loading />
				</div>
			)}
			{useRoutes(routes)}
		</>
	);
});

export default App;
